<template>
    <view class="xilu">
        <view class="page-foot bg-white" @click="bindAdd()">
            <view class="btn1">新建地址</view>
        </view>
        <view class="container">
            <view class="xilu_add_item" v-for="(item,index) in addressList" :key="index">
				<view @click="bindChoose(item.id)">
					<view class="fs34 fwb col10 m-ellipsis-l2">{{item.Area.province+item.Area.city+item.Area.region+item.address}}</view>
					<view class="fs30 col5 pt20"><text class="pr30">{{item.name}}</text><text>{{item.mobile}}</text></view>
				</view>
                <view class="flex-box pt40">
                    <view class="flex-box flex-grow-1" @click="setDefault(item.id)">
                        <image v-if="item.default_status==1" src="/static/icon/choose-on.png" mode="aspectFill" class="xilu_choose"></image>
                        <image v-else src="/static/icon/choose.png" mode="aspectFill" class="xilu_choose"></image>
                        <view class="fs30 col89">默认地址</view>
                    </view>
                    <image src="/static/icon/edit.png" @click="bindEdit(item)" mode="aspectFill" class="xilu_edit"></image>
                    <image src="/static/icon/delete.png" @click="bindDel(index,item.id)" mode="aspectFill" class="xilu_delete"></image>
                </view>
            </view>
        </view>
    </view>
</template>

<script>
    export default {
        data() {
            return {
				fromPlace:'address',
				addressList:[]
            };
        },
		onLoad(options) {
			this.fromPlace = options.from_place || 'address';
			this.fetch();
		},
		methods:{
			fetch(){
				this.$core.get({url: 'xilumarket.user_address/lists',loading:false,data:{},success: (ret) => {
						this.addressList = ret.data;
					}
				})
			},
			//设置
			setDefault(id){
				this.$core.post({url: 'xilumarket.user_address/set_default',data:{address_id: id},success: (ret) => {
						this.fetch()
					}
				})
			},
			//添加
			bindAdd(){
				let page = this;
				uni.navigateTo({
					url: '/pages/address_new/address_new',
					events:{
						addressSuccess:function(data){
							page.fetch();
						}
					},
					success(res) {
					    res.eventChannel.emit('addressTransfor', {})
					}
				})
			},
			//编辑
			bindEdit(item){
				let page = this;
				uni.navigateTo({
					url: '/pages/address_new/address_new',
					events:{
						addressSuccess:function(data){
							page.fetch();
						}
					},
					success(res) {
					    res.eventChannel.emit('addressTransfor', item)
					}
				})
			},
			bindDel(index,id){
				let page = this;
				uni.showModal({
					title: '提示',
					content: '确认删除',
					success(res) {
						if(res.confirm){
							page.$core.post({url: 'xilumarket.user_address/del',data:{address_id: id},success: (ret) => {
									page.addressList.splice(index,1);
									page.$forceUpdate();
								}
							})
						}
					}
				})
			},
			bindChoose(id){
				if(this.fromPlace == 'order'){
					let pages = getCurrentPages();
					this.getOpenerEventChannel().emit("chooseAddress",{addressId:id})
					uni.navigateBack({});
				}
			}
		}
    }
</script>

<style lang="scss" scoped>
    .xilu {
        .container {
            background: #F7F9FD;
        }

        &_add_item {
            width: 690rpx;
            background: #FFFFFF;
            box-shadow: 0rpx 4rpx 20rpx 5rpx rgba(183, 189, 202, 0.05);
            border-radius: 20rpx;
            padding: 30rpx;
            margin: 30rpx;
        }

        &_choose {
            width: 30rpx;
            height: 30rpx;
            margin-right: 15rpx;
        }

        &_edit {
            width: 32rpx;
            height: 32rpx
        }

        &_delete {
            width: 32rpx;
            height: 34rpx;
            margin-left: 40rpx;
        }
    }
</style>